<!DOCTYPE html>
<html  lang="zh" xmlns:th="http://www.thymeleaf.org">
<head>
    <meta charset="utf-8">
    <meta name="viewport" content="width=device-width, initial-scale=1.0">
    <!--360浏览器优先以webkit内核解析-->
    <title>若依介绍</title>
    <link rel="shortcut icon" href="favicon.ico">
    <link href="../static/css/bootstrap.min.css" th:href="@{/css/bootstrap.min.css}" rel="stylesheet"/>
    <link href="../static/css/font-awesome.min.css" th:href="@{/css/font-awesome.min.css}" rel="stylesheet"/>
    <link href="../static/css/style.min.css" th:href="@{/css/style.min.css}" rel="stylesheet"/>
</head>


<body class="gray-bg-main" >
<div class="wrapper wrapper-content animated fadeInRight">
<!--	<div th:background="../static/img/main-background.png"></div>-->
<!--	<div th:background="../static/ruoyi.png"></div>-->
<!--	                        <div><img  src="../static/ruoyi.png" th:src="@{/ruoyi.png}"></div>-->
	<img src="/img/main-background.png" style="width: 100%;    height: 100%;"/>
<!--	<div class="row">-->
<!--		<div class="col-sm-3">-->
<!--			<div class="ibox">-->
<!--				<div class="ibox-content">-->
<!--					<h5 class="m-b-md">Q1 销量</h5>-->
<!--					<h2 class="text-navy">-->
<!--						<i class="fa fa-play fa-rotate-270"></i> 上升-->
<!--					</h2>-->
<!--					<small>更新时间：今天</small>-->
<!--				</div>-->
<!--			</div>-->
<!--		</div>-->
<!--		<div class="col-sm-3">-->
<!--			<div class="ibox">-->
<!--				<div class="ibox-content ">-->
<!--					<h5 class="m-b-md">Q2 销量</h5>-->
<!--					<h2 class="text-navy">-->
<!--						<i class="fa fa-play fa-rotate-270"></i> 上升-->
<!--					</h2>-->
<!--					<small>更新时间：今天</small>-->
<!--				</div>-->
<!--			</div>-->
<!--		</div>-->
<!--		<div class="col-sm-3">-->
<!--			<div class="ibox">-->
<!--				<div class="ibox-content">-->
<!--					<h5 class="m-b-md">Q3 销量</h5>-->
<!--					<h2 class="text-navy">-->
<!--						<i class="fa fa-play fa-rotate-90"></i> 上升-->
<!--					</h2>-->
<!--					<small>更新时间：今天</small>-->
<!--				</div>-->
<!--			</div>-->
<!--		</div>-->
<!--		<div class="col-sm-3">-->
<!--			<div class="ibox">-->
<!--				<div class="ibox-content">-->
<!--					<h5 class="m-b-md">Q4 销量</h5>-->
<!--					<h2 class="text-danger">-->
<!--						<i class="fa fa-play fa-rotate-90"></i> 下降-->
<!--					</h2>-->
<!--					<small>更新时间：今天</small>-->
<!--				</div>-->
<!--			</div>-->
<!--		</div>-->

<!--	</div>-->
<!--	<div class="row">-->
<!--		<div class="col-sm-3">-->
<!--			<div class="ibox">-->
<!--				<div class="ibox-content">-->
<!--					<h5>本日销售量</h5>-->
<!--					<h2>12</h2>-->
<!--					<div id="sparkline1"></div>-->
<!--				</div>-->
<!--			</div>-->
<!--		</div>-->
<!--		<div class="col-sm-3">-->
<!--			<div class="ibox">-->
<!--				<div class="ibox-content">-->
<!--					<h5>本周售票量</h5>-->
<!--					<h2>25</h2>-->
<!--					<div id="sparkline2"></div>-->
<!--				</div>-->
<!--			</div>-->
<!--		</div>-->
<!--		<div class="col-sm-3">-->
<!--			<div class="ibox">-->
<!--				<div class="ibox-content">-->
<!--					<h5>本月售票量</h5>-->
<!--					<h2>50</h2>-->
<!--					<div id="sparkline3"></div>-->
<!--				</div>-->
<!--			</div>-->
<!--		</div>-->
<!--		<div class="col-sm-3">-->
<!--			<div class="ibox">-->
<!--				<div class="ibox-content">-->
<!--					<h5>本年度售票量</h5>-->
<!--					<h2>100</h2>-->
<!--					<div id="sparkline4"></div>-->
<!--				</div>-->
<!--			</div>-->
<!--		</div>-->
<!--	</div>-->

<!--	<div class="row">-->
<!--		<div class="col-sm-3">-->
<!--			<div class="ibox">-->
<!--				<div class="ibox-content">-->
<!--					<h5>座位率</h5>-->
<!--					<h2>65%</h2>-->
<!--					<div class="progress progress-mini">-->
<!--						<div style="width: 68%;" class="progress-bar"></div>-->
<!--					</div>-->

<!--					<div class="m-t-sm small">4:32更新</div>-->
<!--				</div>-->
<!--			</div>-->
<!--		</div>-->

<!--		<div class="col-sm-3">-->
<!--			<div class="ibox">-->
<!--				<div class="ibox-content">-->
<!--					<h5>座位率</h5>-->
<!--					<h2>50%</h2>-->
<!--					<div class="progress progress-mini">-->
<!--						<div style="width: 78%;" class="progress-bar"></div>-->
<!--					</div>-->

<!--					<div class="m-t-sm small">4:32更新</div>-->
<!--				</div>-->
<!--			</div>-->
<!--		</div>-->

<!--		<div class="col-sm-3">-->
<!--			<div class="ibox">-->
<!--				<div class="ibox-content">-->
<!--					<h5>座位率</h5>-->
<!--					<h2>14%</h2>-->
<!--					<div class="progress progress-mini">-->
<!--						<div style="width: 38%;" class="progress-bar progress-bar-danger"></div>-->
<!--					</div>-->

<!--					<div class="m-t-sm small">4:32更新</div>-->
<!--				</div>-->
<!--			</div>-->
<!--		</div>-->

<!--		<div class="col-sm-3">-->
<!--			<div class="ibox">-->
<!--				<div class="ibox-content">-->
<!--					<h5>座位率</h5>-->
<!--					<h2>20%</h2>-->
<!--					<div class="progress progress-mini">-->
<!--						<div style="width: 28%;" class="progress-bar progress-bar-danger"></div>-->
<!--					</div>-->

<!--					<div class="m-t-sm small">4:32更新</div>-->
<!--				</div>-->
<!--			</div>-->
<!--		</div>-->
<!--	</div>-->

<!--	<div class="row">-->
<!--		<div class="col-sm-3">-->
<!--			<div class="ibox">-->
<!--				<div class="ibox-content">-->
<!--					<h5>百分比</h5>-->
<!--					<h2>42/20</h2>-->
<!--					<div class="text-center">-->
<!--						<div id="sparkline5"></div>-->
<!--					</div>-->
<!--				</div>-->
<!--			</div>-->
<!--		</div>-->
<!--		<div class="col-sm-3">-->
<!--			<div class="ibox">-->
<!--				<div class="ibox-content">-->
<!--					<h5>百分比</h5>-->
<!--					<h2>100/54</h2>-->
<!--					<div class="text-center">-->
<!--						<div id="sparkline6"></div>-->
<!--					</div>-->
<!--				</div>-->
<!--			</div>-->
<!--		</div>-->
<!--		<div class="col-sm-3">-->
<!--			<div class="ibox">-->
<!--				<div class="ibox-content">-->
<!--					<h5>百分比</h5>-->
<!--					<h2>685/211</h2>-->
<!--					<div class="text-center">-->
<!--						<div id="sparkline7"></div>-->
<!--					</div>-->
<!--				</div>-->
<!--			</div>-->
<!--		</div>-->
<!--		<div class="col-sm-3">-->
<!--			<div class="ibox">-->
<!--				<div class="ibox-content">-->
<!--					<h5>百分比</h5>-->
<!--					<h2>240/32</h2>-->
<!--					<div class="text-center">-->
<!--						<div id="sparkline8"></div>-->
<!--					</div>-->
<!--				</div>-->
<!--			</div>-->
<!--		</div>-->
<!--	</div>-->

<!--	<div class="row">-->
<!--		<div class="col-sm-3">-->
<!--			<div class="ibox">-->
<!--				<div class="ibox-content">-->
<!--					<h5>本日收入</h5>-->
<!--					<h1 class="no-margins">886,200</h1>-->
<!--					<div class="stat-percent font-bold text-navy">100% <i class="fa fa-bolt"></i></div>-->
<!--					<small>总收入</small>-->
<!--				</div>-->
<!--			</div>-->
<!--		</div>-->
<!--		<div class="col-sm-3">-->
<!--			<div class="ibox">-->
<!--				<div class="ibox-content">-->
<!--					<h5>本周收入</h5>-->
<!--					<h1 class="no-margins">1 738,200</h1>-->
<!--					<div class="stat-percent font-bold text-navy">100% <i class="fa fa-bolt"></i></div>-->
<!--					<small>总收入</small>-->
<!--				</div>-->
<!--			</div>-->
<!--		</div>-->
<!--		<div class="col-sm-3">-->
<!--			<div class="ibox">-->
<!--				<div class="ibox-content">-->
<!--					<h5>本月收入</h5>-->
<!--					<h1 class="no-margins">-200,100</h1>-->
<!--					<div class="stat-percent font-bold text-danger">100% <i class="fa fa-level-down"></i></div>-->
<!--					<small>总收入</small>-->
<!--				</div>-->
<!--			</div>-->
<!--		</div>-->
<!--		<div class="col-sm-3">-->
<!--			<div class="ibox">-->
<!--				<div class="ibox-content">-->
<!--					<h5>本年度收入</h5>-->
<!--					<h1 class="no-margins">54,200</h1>-->
<!--					<div class="stat-percent font-bold text-danger">100% <i class="fa fa-level-down"></i></div>-->
<!--					<small>总收入</small>-->
<!--				</div>-->
<!--			</div>-->
<!--		</div>-->
<!--	</div>-->
<!--	<div class="row">-->
<!--		<div class="col-sm-3">-->
<!--			<div class="ibox">-->
<!--				<div class="ibox-content">-->
<!--					<h5>预警</h5>-->
<!--					<table class="table table-stripped small m-t-md">-->
<!--						<tbody>-->
<!--						<tr>-->
<!--							<td class="no-borders">-->
<!--								<i class="fa fa-circle text-navy"></i>-->
<!--							</td>-->
<!--							<td class="no-borders">-->
<!--								示例 01-->
<!--							</td>-->
<!--						</tr>-->
<!--						<tr>-->
<!--							<td>-->
<!--								<i class="fa fa-circle text-navy"></i>-->
<!--							</td>-->
<!--							<td>-->
<!--								示例 02-->
<!--							</td>-->
<!--						</tr>-->
<!--						<tr>-->
<!--							<td>-->
<!--								<i class="fa fa-circle text-navy"></i>-->
<!--							</td>-->
<!--							<td>-->
<!--								示例 03-->
<!--							</td>-->
<!--						</tr>-->
<!--						</tbody>-->
<!--					</table>-->
<!--				</div>-->
<!--			</div>-->
<!--		</div>-->
<!--		<div class="col-sm-3">-->
<!--			<div class="ibox">-->
<!--				<div class="ibox-content">-->
<!--					<h5>项目</h5>-->
<!--					<table class="table table-stripped small m-t-md">-->
<!--						<tbody>-->
<!--						<tr>-->
<!--							<td class="no-borders">-->
<!--								<i class="fa fa-circle text-navy"></i>-->
<!--							</td>-->
<!--							<td class="no-borders">-->
<!--								示例 01-->
<!--							</td>-->
<!--						</tr>-->
<!--						<tr>-->
<!--							<td>-->
<!--								<i class="fa fa-circle text-navy"></i>-->
<!--							</td>-->
<!--							<td>-->
<!--								示例 02-->
<!--							</td>-->
<!--						</tr>-->
<!--						<tr>-->
<!--							<td>-->
<!--								<i class="fa fa-circle text-navy"></i>-->
<!--							</td>-->
<!--							<td>-->
<!--								示例 03-->
<!--							</td>-->
<!--						</tr>-->
<!--						</tbody>-->
<!--					</table>-->
<!--				</div>-->
<!--			</div>-->
<!--		</div>-->
<!--		<div class="col-sm-3">-->
<!--			<div class="ibox">-->
<!--				<div class="ibox-content">-->
<!--					<h5>消息</h5>-->
<!--					<table class="table table-stripped small m-t-md">-->
<!--						<tbody>-->
<!--						<tr>-->
<!--							<td class="no-borders">-->
<!--								<i class="fa fa-circle text-danger"></i>-->
<!--							</td>-->
<!--							<td class="no-borders">-->
<!--								示例 01-->
<!--							</td>-->
<!--						</tr>-->
<!--						<tr>-->
<!--							<td>-->
<!--								<i class="fa fa-circle text-danger"></i>-->
<!--							</td>-->
<!--							<td>-->
<!--								示例 02-->
<!--							</td>-->
<!--						</tr>-->
<!--						<tr>-->
<!--							<td>-->
<!--								<i class="fa fa-circle text-danger"></i>-->
<!--							</td>-->
<!--							<td>-->
<!--								示例 03-->
<!--							</td>-->
<!--						</tr>-->
<!--						</tbody>-->
<!--					</table>-->
<!--				</div>-->
<!--			</div>-->
<!--		</div>-->
<!--		<div class="col-sm-3">-->
<!--			<div class="ibox">-->
<!--				<div class="ibox-content">-->
<!--					<h5>通知</h5>-->
<!--					<table class="table table-stripped small m-t-md">-->
<!--						<tbody>-->
<!--						<tr>-->
<!--							<td class="no-borders">-->
<!--								<i class="fa fa-circle text-danger"></i>-->
<!--							</td>-->
<!--							<td class="no-borders">-->
<!--								示例 01-->
<!--							</td>-->
<!--						</tr>-->
<!--						<tr>-->
<!--							<td>-->
<!--								<i class="fa fa-circle text-danger"></i>-->
<!--							</td>-->
<!--							<td>-->
<!--								示例 02-->
<!--							</td>-->
<!--						</tr>-->
<!--						<tr>-->
<!--							<td>-->
<!--								<i class="fa fa-circle text-danger"></i>-->
<!--							</td>-->
<!--							<td>-->
<!--								示例 03-->
<!--							</td>-->
<!--						</tr>-->
<!--						</tbody>-->
<!--					</table>-->
<!--				</div>-->
<!--			</div>-->
<!--		</div>-->
<!--	</div>-->
</div>


    <script th:src="@{/js/jquery.min.js}"></script>
    <script th:src="@{/js/bootstrap.min.js}"></script>
    <script th:src="@{/ajax/libs/layer/layer.min.js}"></script>


<th:block th:include="include :: footer" />
<th:block th:include="include :: peity-js" />
<th:block th:include="include :: sparkline-js" />

    <script type="text/javascript">


		$(document).ready(function () {
			$("#sparkline1").sparkline([34, 43, 43, 35, 44, 32, 44, 52], {
				type: 'line',
				width: '100%',
				height: '60',
				lineColor: '#1ab394',
				fillColor: "#ffffff"
			});

			$("#sparkline2").sparkline([24, 43, 43, 55, 44, 62, 44, 72], {
				type: 'line',
				width: '100%',
				height: '60',
				lineColor: '#1ab394',
				fillColor: "#ffffff"
			});

			$("#sparkline3").sparkline([74, 43, 23, 55, 54, 32, 24, 12], {
				type: 'line',
				width: '100%',
				height: '60',
				lineColor: '#ed5565',
				fillColor: "#ffffff"
			});

			$("#sparkline4").sparkline([24, 43, 33, 55, 64, 72, 44, 22], {
				type: 'line',
				width: '100%',
				height: '60',
				lineColor: '#ed5565',
				fillColor: "#ffffff"
			});

			$("#sparkline5").sparkline([1, 4], {
				type: 'pie',
				height: '140',
				sliceColors: ['#1ab394', '#F5F5F5']
			});

			$("#sparkline6").sparkline([5, 3], {
				type: 'pie',
				height: '140',
				sliceColors: ['#1ab394', '#F5F5F5']
			});

			$("#sparkline7").sparkline([2, 2], {
				type: 'pie',
				height: '140',
				sliceColors: ['#ed5565', '#F5F5F5']
			});

			$("#sparkline8").sparkline([2, 3], {
				type: 'pie',
				height: '140',
				sliceColors: ['#ed5565', '#F5F5F5']
			});
		});

		$(function() {
			$("span.pie").peity("pie", {
				fill: ['#1ab394', '#d7d7d7', '#ffffff']
			})

			$(".line").peity("line",{
				fill: '#1ab394',
				stroke:'#169c81',
			})

			$(".bar").peity("bar", {
				fill: ["#1ab394", "#d7d7d7"]
			})

			$(".bar_dashboard").peity("bar", {
				fill: ["#1ab394", "#d7d7d7"],
				width:100
			})

			var updatingChart = $(".updating-chart").peity("line", { fill: '#1ab394',stroke:'#169c81', width: 64 })

			setInterval(function() {
				var random = Math.round(Math.random() * 10)
				var values = updatingChart.text().split(",")
				values.shift()
				values.push(random)

				updatingChart
						.text(values.join(","))
						.change()
			}, 1000);
		});


		//请求统计数据
		$.get(ctx + 'system/ticketmoviebaseinfo/getAccountingData', null, function(data){//param为参数---键值对方式
			// $.each(data.array, function(i,item){
				// console.log("遍历信息="+JSON.stringify(item));
				// var showStr = "电影ID["+item.id+"],名称["+item.name+"],年份["+item.movieYear+"]";
				// $("select[name=movieIdselect]").append("<option value='"+JSON.stringify(item)+"'>"+showStr+"</option>");
				// //找到当前实际数据
				// if($('input[name=movieId]').val() == item.id)
				// {
				// 	$("select[name=movieIdselect]").val(JSON.stringify(item));
				// }
				console.log("收到了统计数据="+JSON.stringify(data));

			// });
		});
    </script>
</body>
</html>
